import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
const root = ReactDOM.createRoot(document.querySelector("#root"));

// 1
// function App(){
//     return (
//         <div>App</div>
//     )
// }

// 2
// const App = function(){
//     return (
//         <div>App2</div>
//     )
// }

// 3
// const App = ()=>{
//     return (
//         <div>App3</div>
//     )
// }

// 4
// const App = ()=><div>App4</div>;

// 5
// const App = (props)=>(
//     <div>
//         <h3>App5</h3>
//         <p>userName:{props.userName}</p>
//         <p>age:{props.age}</p>
//         <div>
//             {/*{props.children[0]}*/}
//             {/*{props.children[1]}*/}
//             {props.children}
//         </div>
//     </div>
// )

root.render((
    <App userName={"zhangsan"} age={12}>
        <h5>标题</h5>
        <p style={{background:"red"}}>内容</p>
    </App>
))